<script setup>
// 导入Vue的reactive函数，用于创建响应式对象
import { reactive } from "vue";
// 导入Element Plus的中文语言包，用于国际化
import zhCn from "element-plus/dist/locale/zh-cn.mjs";
// 使用reactive创建一个响应式配置对象config
const config = reactive({
  autoInsertSpace: true, // 配置项，自动插入空格
});
</script>

<template>
  <!-- 使用Element Plus的el-config-provider组件来提供全局配置和语言环境 -->
  <el-config-provider :button="config" :locale="zhCn">
    <!-- router-view组件用于展示当前路由匹配到的组件内容 -->
    <router-view> </router-view>
  </el-config-provider>
</template>

<style   lang="scss">
/* 为页面容器添加内边距，确保内容不会被顶部遮挡 */
.page-container {
  padding: 20px;
  box-sizing: border-box; /* 确保宽高包含padding和border */
  padding-top: 36px !important; /* 重要的顶部内边距，可能用于避开页面顶部的导航栏或其他元素 */
}

.input-default-width {
  width: 200px !important;

  .el-input {
    --el-input-width: 200px !important;
  }
}
</style>